﻿<UserControl x:Class="Sample.PhotoBrowser.FlickrPhotoBarChart"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="clr-namespace:Sample.PhotoBrowser"
    Height="Auto" Width="Auto" Cursor="Arrow" Background="Transparent">
    <UserControl.Resources>
        <local:BarChartConverter x:Key="BarChartConverter"/>
    </UserControl.Resources>
    <Grid Grid.Row="1" Margin="5">
        <Grid.RowDefinitions>
            <RowDefinition Height="*"/>
            <RowDefinition Height="20"/>
        </Grid.RowDefinitions>
        <Border BorderThickness="1, 0, 0, 1" BorderBrush="White">
            <ItemsControl x:Name="ctrlBarChart" Grid.ColumnSpan="2" Grid.Row="0">
                <ItemsControl.ItemsPanel>
                    <ItemsPanelTemplate>
                        <UniformGrid IsItemsHost="True" Columns="1"/>
                    </ItemsPanelTemplate>
                </ItemsControl.ItemsPanel>
                <ItemsControl.ItemTemplate>
                    <DataTemplate>
                        <StackPanel Orientation="Horizontal">
                            <Border Margin="0, 2, 0, 2" BorderBrush="Black" BorderThickness="0, 1, 1, 1" CornerRadius="0, 5, 5, 0" Width="{Binding Path=BarWidth}" HorizontalAlignment="Left">
                                <Border.Background>
                                    <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
                                        <GradientStop Offset="0" Color="{Binding Path=BarColor}"/>
                                        <GradientStop Offset="1" Color="Black"/>
                                    </LinearGradientBrush>
                                </Border.Background>
                                <Border.Style>
                                    <Style>
                                        <Style.Triggers>
                                            <Trigger Property="Border.IsMouseOver" Value="True">
                                                <Setter Property="Border.Opacity" Value="1"/>
                                            </Trigger>
                                            <Trigger Property="Border.IsMouseOver" Value="False">
                                                <Setter Property="Border.Opacity" Value="0.5" />
                                            </Trigger>
                                        </Style.Triggers>
                                    </Style>
                                </Border.Style>
                            </Border>
                            <TextBlock Text="{Binding Path=BarName}" Foreground="White" Margin="10, 0, 0, 0" VerticalAlignment="Center"/>
                        </StackPanel>
                    </DataTemplate>
                </ItemsControl.ItemTemplate>
            </ItemsControl>
        </Border>
        <Grid Grid.Row="1">
            <Label Foreground="White" Margin="-5, -3, 0, 0">0</Label>
            <Label Foreground="White" Margin="30, -3, 0, 0">1</Label>
            <Label Foreground="White" Margin="70, -3, 0, 0">2</Label>
            <Label Foreground="White" Margin="110, -3, 0, 0">3</Label>
            <Label Foreground="White" Margin="150, -3, 0, 0">4</Label>
            <Label Foreground="White" Margin="190, -3, 0, 0">5</Label>
            <Label Foreground="White" Margin="230, -3, 0, 0">6</Label>
            <Label Foreground="White" Margin="270, -3, 0, 0">7</Label>
            <Label Foreground="White" Margin="310, -3, 0, 0">8</Label>
            <Label Foreground="White" Margin="350, -3, 0, 0">9</Label>
        </Grid>
    </Grid>
</UserControl>
